<template>
	<view class="user-examine">
		<view class="top-nav">
			<view @click="backBtn">返回</view>
			<view>人员审核</view>
			<view></view>
		</view>
		<view class="main">
			<!-- <view class="main-content">
				<view>提示：</view>
				<view>您已选择{{verifyIdList.length}}人</view>
			</view> -->
			<checkbox-group class="checkbox" @change="checkboxChange">
				<label class="" v-for="item in userList" :key="item.id">
					<image :src="item.avatar_url" mode=""></image>
					<view>{{item.username}}</view>
					<view>
						<checkbox :value="item.id.toString()" :checked="item.status == 2" />
					</view>
				</label>
			</checkbox-group>
			<view class="main-content">
				<view class="button btn-currency" @click="submitExamine()">确定</view>
			</view>
		</view>
	</view>
</template>

<script>
	var _this;
	export default {
		data() {
			return {
				taskId: '',
				openId: 'ogiDYs4eDr9DA2pofZeYsFQygtt4',
				// baseUrl: 'http://192.168.3.23:8085/jeecg-boot/',
				baseUrl: 'http://weixiaokong.91xiaokong.com/jeecg-boot/',

				userList: [],
				verifyIdList: [],
			}
		},
		onLoad(option) {
			_this = this;
			_this.taskId = option.id;
			let openid = uni.getStorageSync('openid')
			if (openid) {
				_this.openId = openid
			}
			// 所有报名用户集合
			uni.request({
				url: _this.baseUrl + 'api/rescue/infoUserList',
				data: {
					infoId: _this.taskId,
					openId: _this.openId,
				},
				success(res) {
					_this.userList = res.data.result
				}
			});
		},
		methods: {
			backBtn() {
				uni.navigateBack({
					delta: 1
				})
			},
			checkboxChange: function(e) {
				var items = this.items,
					values = e.detail.value;
				_this.verifyIdList = values;
				// for (var i = 0, lenI = items.length; i < lenI; ++i) {
				// 	const item = items[i]
				// 	if (values.includes(item.value)) {
				// 		this.$set(item, 'checked', true)
				// 	} else {
				// 		this.$set(item, 'checked', false)
				// 	}
				// }
			},
			// 提交审核
			submitExamine() {
				uni.request({
					url: _this.baseUrl + 'api/rescue/verify',
					method: 'POST',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
					},
					data: {
						infoId: _this.taskId,
						openId: _this.openId,
						verifyIdList: _this.verifyIdList
					},
					success(res) {
						if (res.data.code == 200) {
							alert('提交成功')
							uni.navigateBack({
								delta: 1
							})
						}
					}
				})
			},
		}
	}
</script>

<style>
	.user-examine {
		padding-top: 100rpx;
	}

	.top-nav {
		line-height: 100rpx;
		display: flex;
		justify-content: space-between;
		background-color: #FFFFFF;
		margin-bottom: 20rpx;
		padding: 0 5%;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		background-color: #FFFFFF;
		z-index: 1000;
	}

	.main {
		width: 88%;
		margin: 0 auto;
		box-shadow: 0px 0px 30px 0px rgb(0 0 0 / 10%);
		border-radius: 20rpx;
		padding: 30rpx;
		margin-bottom: 30rpx;
		background-color: #fff;
		border: 2rpx #706d6c;
	}

	.checkbox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.checkbox>label {
		margin: auto;
		text-align: center;
	}

	.checkbox image {
		width: 120rpx;
		height: 120rpx;
	}

	.main-content {
		display: flex;
		padding: 20rpx 0;
	}

	.button {
		width: 150rpx;
		height: 40rpx;
		line-height: 40rpx;
		margin-top: 40rpx;
		margin-left: 50rpx;
		border-radius: 30rpx;
		font-size: 30rpx;
		padding: 10rpx;
		text-align: center;
		margin: auto;
	}

	.btn-currency {
		background-color: #b30002;
		color: #FFFFFF;
		border: none;
	}
</style>
